<?php /*a:1:{s:52:"D:\projects\junhe\app\admin\view\attribute\form.html";i:1741973023;}*/ ?>
<form class="layui-form layui-card" data-table-id="MenuTable" action="<?php echo sysuri(); ?>" data-auto="true" method="post">
    <div class="layui-card-body">
        <div class="layui-form-item">
            <label class="layui-form-label">属性名称</label>
            <div class="layui-input-block">
                <input type="text" name="name" required lay-verify="required" value='<?php echo htmlentities((isset($vo['name']) && ($vo['name'] !== '')?$vo['name']:""),ENT_QUOTES); ?>' placeholder="请输入属性名称" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">产品分类</label>
            <div class="layui-input-block">
                <select class="layui-select" required lay-verify="required" name="cate_id" lay-search>
                    <option value="">选择分类</option>
                    <?php foreach($parent_cate as $cate): ?>
                        <option <?php if(isset($vo['parent_id']) and $vo['parent_id'] == $cate['id']): ?> selected<?php endif; ?> disabled value="<?php echo htmlentities($cate['id'],ENT_QUOTES); ?>"><?php echo htmlentities((isset($cate['title']) && ($cate['title'] !== '')?$cate['title']:''),ENT_QUOTES); ?></option>
                        <?php foreach($cate['child_cate_2'] as $cate2): if($cate2 === end($cate['child_cate_2'])): ?>
                                <option <?php if(isset($vo['cate_id']) and $vo['cate_id'] == $cate2['id']): ?> selected<?php endif; ?>  disabled value="<?php echo htmlentities($cate2['id'],ENT_QUOTES); ?>">╚ <?php echo htmlentities((isset($cate2['title']) && ($cate2['title'] !== '')?$cate2['title']:''),ENT_QUOTES); ?></option>
                            <?php else: ?>
                                <option <?php if(isset($vo['cate_id']) and $vo['cate_id'] == $cate2['id']): ?> selected<?php endif; ?> disabled  value="<?php echo htmlentities($cate2['id'],ENT_QUOTES); ?>">╠ <?php echo htmlentities((isset($cate2['title']) && ($cate2['title'] !== '')?$cate2['title']:''),ENT_QUOTES); ?></option>
                            <?php endif; foreach($cate2['child_cate_3'] as $cate3): if($cate3 === end($cate2['child_cate_3'])): ?>
                                    <option <?php if(isset($vo['cate_id']) and $vo['cate_id'] == $cate3['id']): ?> selected<?php endif; ?> value="<?php echo htmlentities($cate3['id'],ENT_QUOTES); ?>"> └─ <?php echo htmlentities((isset($cate3['title']) && ($cate3['title'] !== '')?$cate3['title']:''),ENT_QUOTES); ?></option>
                                <?php else: ?>
                                    <option <?php if(isset($vo['cate_id']) and $vo['cate_id'] == $cate3['id']): ?> selected<?php endif; ?> value="<?php echo htmlentities($cate3['id'],ENT_QUOTES); ?>"> ├─ <?php echo htmlentities((isset($cate3['title']) && ($cate3['title'] !== '')?$cate3['title']:''),ENT_QUOTES); ?></option>
                                <?php endif; ?>
                            <?php endforeach; ?>
                        <?php endforeach; ?>
                    <?php endforeach; ?>
                </select>
                
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">属性类型</label>
            <div class="layui-input-block">
                <select name="type" lay-verify="required" lay-filter="type">
                    <option <?php if(isset($vo['type']) && $vo['type'] == 'input'): ?> selected <?php endif; ?> value="input">输入框</option>
                    <option <?php if(isset($vo['type']) && $vo['type'] == 'select'): ?> selected <?php endif; ?> value="select">下拉框</option>
                    <option <?php if(isset($vo['type']) && $vo['type'] == 'checkbox'): ?> selected <?php endif; ?> value="checkbox">多选</option>
                </select>
            </div>
        </div>
        <div id="options-container" style="<?php if(isset($vo['values']) && count($vo['values'])): ?>display: block; <?php else: ?>display: none; <?php endif; ?>">
            <div class="layui-form-item">
                <label class="layui-form-label">下拉选项</label>
                <div class="layui-input-block">
                    <div id="options-list" style="max-height: 600px;overflow-y: scroll;">
                        <?php if(isset($vo['values']) && count($vo['values'])): if(is_array($vo['values']) || $vo['values'] instanceof \think\Collection || $vo['values'] instanceof \think\Paginator): $i = 0; $__LIST__ = $vo['values'];if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$value): $mod = ($i % 2 );++$i;?>
                                <div class="option-item" style="margin-bottom: 10px;">
                                    <input type="text" name="options[]" value="<?php echo htmlentities($value['value'],ENT_QUOTES); ?>" placeholder="请输入选项值" autocomplete="off" class="layui-input" style="display: inline-block; width: 60%;">
                                    <button type="button" class="layui-btn layui-btn-normal layui-btn-sm insert-option" style="display: inline-block; width: 18%;">插入</button>
                                    <button type="button" class="layui-btn layui-btn-danger layui-btn-sm delete-option" style="display: inline-block; width: 18%;">删除</button>
                                </div>
                            <?php endforeach; endif; else: echo "" ;endif; ?>
                        <?php endif; ?>
                    </div>
                   
                    <button type="button" class="layui-btn layui-btn-sm" id="add-option">添加选项</button>
                    <button type="button" class="layui-btn layui-btn-sm layui-btn-primary" id="import-options">导入选项</button>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">排序</label>
            <div class="layui-input-block">
                <input type="text" name="sort" required lay-verify="required" value='<?php echo htmlentities((isset($vo['sort']) && ($vo['sort'] !== '')?$vo['sort']:"0"),ENT_QUOTES); ?>' placeholder="请输入排序" autocomplete="off" class="layui-input">
            </div>
        </div>
    </div>

    <div class="hr-line-dashed"></div>
    <?php if(!(empty($vo['id']) || (($vo['id'] instanceof \think\Collection || $vo['id'] instanceof \think\Paginator ) && $vo['id']->isEmpty()))): ?><input type='hidden' value='<?php echo htmlentities($vo['id'],ENT_QUOTES); ?>' name='id'><?php endif; ?>

    <div class="layui-form-item text-center">
        <button class="layui-btn" type='submit'>保存数据</button>
        <button class="layui-btn layui-btn-danger" type='button' data-confirm="确定要取消编辑吗？" data-close>取消编辑</button>
    </div>
</form>


<script>
layui.use(['form', 'jquery','upload'], function(){
    var form = layui.form;
    var $ = layui.jquery;
    var upload = layui.upload;

    // 监听属性类型变化
    form.on('select(type)', function(data){
        if (data.value === 'select' || data.value === 'checkbox') {
            $('#options-container').show();
        } else {
            $('#options-container').hide();
        }
        $('#options-list').empty();
    });

    // 添加下拉选项
    $('#add-option').click(function(){
        var optionHtml = `
            <div class="option-item" style="margin-bottom: 10px;">
                <input type="text" name="options[]" placeholder="请输入选项值" autocomplete="off" class="layui-input" style="display: inline-block; width: 60%;">
                <button type="button" class="layui-btn layui-btn-normal layui-btn-sm insert-option" style="display: inline-block; width: 18%;">插入</button>
                <button type="button" class="layui-btn layui-btn-danger layui-btn-sm delete-option" style="display: inline-block; width: 18%;">删除</button>
            </div>
        `;
        $('#options-list').append(optionHtml);
    });

    $(document).on('click', '.insert-option', function () {
        var optionHtml = `
            <div class="option-item" style="margin-bottom: 10px;">
                <input type="text" name="options[]" placeholder="请输入选项值" autocomplete="off" class="layui-input" style="display: inline-block; width: 60%;">
                <button type="button" class="layui-btn layui-btn-normal layui-btn-sm insert-option" style="display: inline-block; width: 18%;">插入</button>
                <button type="button" class="layui-btn layui-btn-danger layui-btn-sm delete-option" style="display: inline-block; width: 18%;">删除</button>
            </div>
        `;
        $(this).closest('.option-item').after(optionHtml);
    });
    // 删除下拉选项
    $(document).on('click', '.delete-option', function(){
        $(this).closest('.option-item').remove(); // 移除当前选项
    });
      // 导入选项功能
      upload.render({
        elem: '#import-options', // 绑定导入按钮
        url: '<?php echo url("/admin/attribute/upload_option"); ?>', // 上传文件的接口地址
        accept: 'file', // 允许上传的文件类型
        exts: 'txt|csv', // 允许上传的文件后缀
        done: function(response){
            res = JSON.parse(response);
         
            if (res.code === 1) {
                var options = res.info; // 假设返回的数据是一个数组
                options.forEach(function(option) {
                    var optionHtml = `
                        <div class="option-item" style="margin-bottom: 10px;">
                            <input type="text" name="options[]" value="${option}" placeholder="请输入选项值" autocomplete="off" class="layui-input" style="display: inline-block; width: 60%;">
                            <button type="button" class="layui-btn layui-btn-normal layui-btn-sm insert-option" style="display: inline-block; width: 18%;">插入</button>
                            <button type="button" class="layui-btn layui-btn-danger layui-btn-sm delete-option" style="display: inline-block; width: 18%;">删除</button>
                        </div>
                    `;
                    $('#options-list').append(optionHtml);
                });
                layer.msg('导入成功', {icon: 1});
            } else {
                layer.msg(res.msg || '导入失败', {icon: 2});
            }
        },
        error: function(){
            layer.msg('上传失败，请检查网络或文件格式', {icon: 2});
        }
    });
});
</script>
